import React from 'react';
import './App.css';
import {HomePage} from "./home";
import {BrowserRouter as Router,  Route, Routes} from 'react-router-dom';
import { CreateMap } from './map/create_map';
import { CreateTwoMap } from './map/create_two_map';
import { MapLifecycle } from './map/map_lifecycle';
import { MapLevel } from "./map/map_level";
import { MapCenter } from "./map/map_center";
import { MapMaxLevel } from "./map/map_max_level";
import { MapWidget } from './map/map_widget';
import { MapDrawWidget } from './map/map_draw_Widget';
import { MapViewPort } from './map/map_view_port';
import { MapAddRemoveOverlays } from './map/map_add_remove_overlays';
import { MapAddRemoveCategoryOverlays } from './map/map_add_remove_category_overlays';
import { MapPointCurd } from './map/map_point_curd';
import { MapBasicMarkupOverlays } from './map/map_basic_markup_overlays';
import { MapClusterOverlays } from './map/map_cluster_overlays';
import { MapHeatOverlays } from './map/map_heat_overlays';
import { MapMassMarker } from './map/map_mass_marker';
import { MapAdministrativeAreaOutline } from './map/map_administrative_area_outline';
import { MapEvent } from './map/map_event';
import { MapOverlaysEvent } from './map/map_overlays_event';


function App() {
  return (
    <div className={"App"}>
      <Router>
        <Routes>
            <Route path="/" element={<HomePage/>}>
                <Route path={'create_map'} element={<CreateMap/>}/>
                <Route path={'create_two_map'} element={<CreateTwoMap/>}/>
                <Route path={'map_lifecycle'} element={<MapLifecycle/>}/>
                <Route path={'map_level'} element={<MapLevel/>}/>
                <Route path={'map_center'} element={<MapCenter/>}/>
                <Route path={'map_max_level'} element={<MapMaxLevel/>}/>
                <Route path={'map_widget'} element={<MapWidget/>}/>
                <Route path={'map_draw_Widget'} element={<MapDrawWidget/>}/>
                <Route path={'map_view_port'} element={<MapViewPort/>}/>
                <Route path={'map_add_remove_overlays'} element={<MapAddRemoveOverlays/>}/>
                <Route path={'map_add_remove_category_overlays'} element={<MapAddRemoveCategoryOverlays/>}/>
                <Route path={'map_point_curd'} element={<MapPointCurd/>}/>
                <Route path={'map_basic_markup_overlays'} element={<MapBasicMarkupOverlays/>}/>
                <Route path={'map_cluster_overlays'} element={<MapClusterOverlays/>}/>
                <Route path={'map_heat_overlays'} element={<MapHeatOverlays/>}/>
                <Route path={'map_mass_marker'} element={<MapMassMarker/>}/>
                <Route path={'map_administrative_area_outline'} element={<MapAdministrativeAreaOutline/>}/>
                <Route path={'map_event'} element={<MapEvent/>}/>
                <Route path={'map_overlays_event'} element={<MapOverlaysEvent/>}/>
                <Route
                    path="*"
                    element={
                        <main style={{padding: "1rem"}}>
                        <p>There's nothing here!</p>
                        </main>
                    }
                />
            </Route>
        </Routes>

      </Router>

    </div>
  );
}

export default App;
